import { Card, Form, Input, Select, Divider, Row, Col, Button, Space, Collapse } from '@/utils/antd-imports';
import { PlusOutlined, MinusOutlined, ArrowUpOutlined, ArrowDownOutlined } from '@/utils/icons';
import React from 'react';



import InputNumber from 'antd/es/input-number';





import TimePicker from 'antd/es/time-picker';


import DatePicker from 'antd/es/date-picker';

import moment from 'moment';

const { Option } = Select;
const { TextArea } = Input;
const { Panel } = Collapse;

const AcceptanceStep = ({ form, initialValues, managers = [], directors = [], onValuesChange }) => {

  // 处理初始值，将日期字符串转换为 moment 对象
  const processedInitialValues = React.useMemo(() => {
    const defaultValues = {
      warningSettings: {
        lowDaysBefore: 30,
        mediumDaysBefore: 15,
        highDaysBefore: 3,
        interval: 1,
        time: moment('09:00', 'HH:mm')
      }
    };
    
    if (!initialValues) return defaultValues;
    
    const values = { ...defaultValues, ...initialValues };
    
    // 处理验收时间点
    if (values.acceptancePoints && Array.isArray(values.acceptancePoints)) {
      values.acceptancePoints = values.acceptancePoints.map(point => ({
        ...point,
        date: point.date ? moment(point.date) : null
      }));
    }
    
    // 处理预警时间
    if (values.warningSettings && values.warningSettings.time) {
      values.warningSettings.time = moment(values.warningSettings.time, 'HH:mm');
    }
    
    return values;
  }, [initialValues]);

  return (
    <Card title="验收周期与预警配置" style={{ marginTop: 16 }}>
      <Form
        form={form}
        layout="vertical"
        initialValues={processedInitialValues}
        onValuesChange={onValuesChange}
      >
        <Divider orientation="left">验收时间点配置</Divider>
        
        <Form.List name="acceptancePoints">
          {(fields, { add, remove, move }) => (
            <>
              {fields.map(({ key, name, ...restField }, index) => {
                const fieldValue = form.getFieldValue(['acceptancePoints', name]);
                const isExisting = fieldValue?.isExisting;
                return (
                  <div key={key} style={{ marginBottom: 16, padding: 16, border: '1px solid #d9d9d9', borderRadius: 4 }}>
                    <Row gutter={16}>
                      <Col span={16}>
                        <Form.Item
                          {...restField}
                          name={[name, 'date']}
                          label={`验收时间点 ${index + 1}`}
                          rules={[{ required: true, message: '请选择验收时间' }]}
                        >
                          <DatePicker 
                            style={{ width: '100%' }} 
                            format="YYYY-MM-DD"
                            disabledDate={current => {
                              return current && current < moment().startOf('day');
                            }}
                          />
                        </Form.Item>
                      </Col>
                      <Col span={8} style={{ display: 'flex', alignItems: 'flex-end' }}>
                        <Space>
                          {index > 0 && (
                            <Button
                              icon={<ArrowUpOutlined />}
                              onClick={() => move(index, index - 1)}
                            />
                          )}
                          {index < fields.length - 1 && (
                            <Button
                              icon={<ArrowDownOutlined />}
                              onClick={() => move(index, index + 1)}
                            />
                          )}
                          {!isExisting && (
                            <Button
                              danger
                              icon={<MinusOutlined />}
                              onClick={() => remove(name)}
                            />
                          )}
                        </Space>
                      </Col>
                    </Row>
                  </div>
                );
              })}
              <Form.Item>
                <Button
                  type="dashed"
                  onClick={() => add({ date: null })}
                  block
                  icon={<PlusOutlined />}
                >
                  添加验收时间点
                </Button>
              </Form.Item>
            </>
          )}
        </Form.List>

        <Form.Item
          name="acceptancePersonnel"
          label="验收人员"
        >
          <Select
            mode="multiple"
            placeholder="请选择验收人员"
            showSearch
            optionFilterProp="children"
          >
            {[...managers, ...directors]
              .filter((person, index, self) => 
                self.findIndex(p => p.id === person.id) === index
              )
              .map(person => (
                <Option key={`acceptance-${person.id}`} value={person.id}>
                  {person.name} ({person.employeeCode || person.position})
                </Option>
              ))}
          </Select>
        </Form.Item>

        <Form.Item name="acceptanceCriteria" label="验收标准">
          <TextArea rows={4} placeholder="请输入验收标准和具体要求" />
        </Form.Item>

        <Divider orientation="left">预警设置</Divider>

        <Collapse defaultActiveKey={['1']}>
          <Panel header="预警配置" key="1">
            <Row gutter={16}>
              <Col span={8}>
                <Form.Item
                  name={['warningSettings', 'lowDaysBefore']}
                  label="低级别预警提前天数"
                >
                  <InputNumber
                    style={{ width: '100%' }}
                    min={1}
                    placeholder="低级别预警提前天数"
                  />
                </Form.Item>
              </Col>
              <Col span={8}>
                <Form.Item
                  name={['warningSettings', 'mediumDaysBefore']}
                  label="中级别预警提前天数"
                >
                  <InputNumber
                    style={{ width: '100%' }}
                    min={1}
                    placeholder="中级别预警提前天数"
                  />
                </Form.Item>
              </Col>
              <Col span={8}>
                <Form.Item
                  name={['warningSettings', 'highDaysBefore']}
                  label="高级别预警提前天数"
                >
                  <InputNumber
                    style={{ width: '100%' }}
                    min={1}
                    placeholder="高级别预警提前天数"
                  />
                </Form.Item>
              </Col>
            </Row>
            <Row gutter={16}>
              <Col span={12}>
                <Form.Item
                  name={['warningSettings', 'interval']}
                  label="预警间隔(天)"
                >
                  <InputNumber
                    style={{ width: '100%' }}
                    min={1}
                    placeholder="预警间隔天数"
                  />
                </Form.Item>
              </Col>
              <Col span={12}>
                <Form.Item
                  name={['warningSettings', 'time']}
                  label="预警时间"
                >
                  <TimePicker format="HH:mm" style={{ width: '100%' }} />
                </Form.Item>
              </Col>
            </Row>
          </Panel>
        </Collapse>
      </Form>
    </Card>
  );
};

export default AcceptanceStep;